<template>
 <view class="incomeStatistics">
  <view class="index">
	  <view class="nav d_f j_c_c a_i_c">
	  	<view class="text">Friends rewards</view>
	  	<image src="../../static/ct_0022_返回键深色.png" mode="" class="right" @tap="back"></image>
		
	  </view>
	  <view class="t_a_c text">My staff: {{ mystaff }} </view>
	  <view class="box m_t_16">
			  <uni-table border stripe emptyText="暂无更多数据" >
			  	<!-- 表头行 -->
			  	<uni-tr>
			  		<uni-th align="center" width="80rpx" class="header">Staff Level</uni-th>
			  		<uni-th align="center" width="80rpx" class="header">Friends</uni-th>
			  		<uni-th align="center" width="80rpx" class="header">obtain</uni-th>
			  				<!-- <uni-th align="center" width="80rpx" class="header">Friend</uni-th>
			  				<uni-th align="center" width="80rpx" class="header">obtain</uni-th> -->
			  	</uni-tr>
			  	<!-- 表格数据行 -->
			  	<uni-tr v-for="(item,index) in records" :key="index">
			  		<uni-td align="center" class='size'>{{item.name}}</uni-td>
			  		<uni-td align="center" class='size'>{{ item.myfriends }}</uni-td>
			  		<uni-td align="center" class='size'>{{item.level_one*100}}%</uni-td>
			  				<!-- <uni-td align="center" class='size'>{{index+1}}</uni-td>
			  				<uni-td align="center" class='size'>{{item.level_two}}%</uni-td> -->
			  	</uni-tr>
			  	
			  
			  </uni-table>
			   <view class="button d_f j_c_c a_i_c" @tap="click">Data</view>
	  </view>
  </view>
 </view>
</template>

<script>
 export default {
   data () {
     return {
       records:[],
	   model:{
	   		   page:1,
	   		   pagesize:10,
	   },
	   total:0,
	   mystaff:''
     }
	 
   },
   components: {

   },
   methods: {
     back(){
     	uni.navigateBack({
     		delta: 1
     	});
     },
	 getData(){
		 this.$api.getRecommendrule(this.model).then(res=>{
			 this.records=res.data.list
			 this.mystaff=res.data.mystaff
		 })
	 },
	 click(){
	 		  uni.navigateTo({
	 		  	url:'/pages/index/incomeStatistics'
	 		  })
	 }
   },
   onLoad() {
   this.getData()
   },
   watch: {

   },
   computed: {

   }
 }
</script>

<style scoped lang='scss'>
.incomeStatistics{
	width: 100%;
	height: 100%;
	background: rgb(239, 237, 238);
	.index{
		width: calc(100% - 64rpx);
		margin-left: 32rpx;
		height: 100%;
		padding-bottom: 32rpx;
		.text {
				font-size: 32rpx;
				font-weight: 700;
			color: #000;
			}
		.nav {
			width: 100%;
			height: 100rpx;
			
			position: relative;
		    z-index: 9999;
			
		
			.right {
				width: 20rpx;
				height: 32rpx;
				position: absolute;
				left: 0rpx;
				z-index: 999;
				transform: rotate(180deg);
			}
		}
		.box{
			width: 100%;
			background: #fff;
			border-radius: 20rpx;
			height: calc(100% - 200rpx);
			padding: 32rpx;
			position: relative;
			.header{
				background: rgb(100,186,144);
				color: #fff;
				font-size: 28rpx;
			}
			.size{
				font-weight: 700 !important;
				font-size: 24rpx;
			}
			.button{
				width: 622rpx;
				background: rgb(101,186,144);
				color: #FFFFFF;
				border-radius: 20rpx;
				height: 90rpx;
				margin-top: 64rpx;
				position: absolute;
				bottom: 64rpx;
				
			}
		}
	 
	}
}
</style>